import React from "react";
import { useDispatch, useSelector } from "react-redux";
import "./style.scss";
import { Button, Cell } from "react-vant";
import { useNavigate } from "react-router-dom";
import { quitLogin } from "../../store/modules/user/userActions";
const Index = () => {
  const avator = useSelector((state) => state.user.userInfo.avator);
  const nickname = useSelector((state) => state.user.userInfo.nickname);
  const navigate = useNavigate();
  const dispatch = useDispatch();
  const token = localStorage.getItem("token");
  return (
    <div>
      {token ? (
        <div className="user">
          <img src={avator} alt="" />
          <h2>{nickname}</h2>
        </div>
      ) : (
        <div className="user">
          <Button onClick={() => navigate("/login?from=/my")}>
            还没登录，请登录？
          </Button>
        </div>
      )}

      <Cell.Group>
        <Cell
          title="浏览记录"
          isLink
          onClick={() => navigate("/brower/list")}
        />
        <Cell
          title="我的收藏"
          isLink
          onClick={() => navigate("/collect/list")}
        />
        <Cell title="我的收获地址" isLink onClick={() => navigate('/address/list')}/>
        <Cell title="退出登录" isLink onClick={() => dispatch(quitLogin())} />
      </Cell.Group>
    </div>
  );
};

export default Index;
